.index {
  background: #f7f7f7;
  position: fixed;
  width: 100%;
  top: 0;
  bottom: 0;

  .container-wrapper {
    position: fixed;
    display: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0rem;
    overflow: hidden;
  }
  .main-content {
    .back {
      height: 420px;
      background: url("../../style/images/login/back@2x.png") no-repeat center
        center;
    }
    .info-form {
      position: absolute;
      width: 100%;
      height: 340px;
      padding: 20px 40px;
      top: 100px;
      .user-info {
        padding: 60px 10px;
        width: 100%;
        height: 100%;
        font-size: 28px;
        border-radius: 10px;
        background: #fff;
        .no-login {
          text-align: center;
          color: #999;
          padding-top: 20px;
          padding-bottom: 20px;
          font-size: 28px;
        }
        .login-register-wrap {
          margin: 20px auto;
          text-align: center;
          .to-login,
          .to-register {
            text-align: center;
            display: inline-block;
            border: solid 1px #ff9898;
            width: 200px;
            height: 68px;
            background: #fff;
            border-radius: 36px;
            color: #999;
            line-height: 68px;
            font-size: 32px;
            margin: 0 10px;
          }
          .to-register {
            color: #ff9898;
          }
        }
      }
      .form {
        padding: 60px 0;
        width: 100%;
        height: 100%;
        background: #fff;
        font-size: 28px;
        border-radius: 15px;
        .avatar {
          text-align: center;
          .img {
            width: 150px;
            height: 150px;
            margin-top: -250px;
            border-radius: 50%;
          }
          .text {
            font-size: 28px;
            display: block;
          }
        }
        .tools {
          background: #fff;
          clear: both;
          padding-bottom: 45px;
          .ul {
            text-align: center;
            display: flex;
            justify-content: space-around;
            padding-top: 38px;
            .li {
              text-align: center;
              position: relative;
              display: flex;
              flex-direction: column;
              align-content: center;
              justify-content: center;
              .v-line-left {
                position: absolute;
                left: -100%;
                top: 40px;
                bottom: 0;
                width: 1px;
                border-left: solid 1px #e7e5e5;
              }
              .img {
                width: 68px;
                height: 68px;
                vertical-align: middle;
                margin-bottom: 25px;
              }
              .span {
                font-size: 26px;
                display: block;
              }
            }
          }
        }
      }
    }
    .menu {
      margin-top: 100px;
      .cu-item {
        border-bottom: 1rpx solid #efefef;
      }
      .no-border {
        border-bottom: none;
      }
      .img {
        width: 40px;
        height: 40px;
        margin-right: 43px;
        vertical-align: middle;
      }
    }
  }
}
